<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <body>

        <ui:composition template="./MainTemplate.xhtml">

            <ui:define name="title">
                Enquiry Driver
            </ui:define>

            <ui:define name="head">
                <script type="text/javascript">
                    ( function($) {
                        // Make tab item 'driver' on menu is active
                        $(document).ready( function() { 
                            $('#driver').addClass("active"); 
                            //show advance search
                            $('.adv-click').click(function() {
                                $('.simple-search').hide(350);
                                $('.adv-search').show(350);
                            });
                        });
                        
                    }) ( jQuery );
                </script>
            </ui:define>

            <ui:define name="left">                                
                <h:form>
                    <p:panel>
                        <h2>Team1 RadioCabs</h2>
                        <br></br>
                        Submit your enquiry to hire a cab at website. Get free call back within 5 minutes after sumbitting your enquiry.
                        <br></br>
                    </p:panel>
                    <br></br>
                    <p:panel>
                        <h2>Enquiry Form</h2>
                        <p:messages autoUpdate="true" showDetail="true" showSummary="true"></p:messages>
                        <table cellpadding="5" cellspacing="5">                       
                            <tbody>
                                <tr>
                                    <td><h:outputLabel value="Name:"/></td>
                                    <td> <p:inputText id="name" value="#{enquiry.name}"/>   </td>
                                </tr>
                                <tr>
                                    <td> <h:outputLabel value="Phone:"/></td>
                                    <td><p:inputText id="contact" value="#{enquiry.phone}"/> </td>
                                </tr>
                                <tr>
                                    <td><h:outputLabel value="Email:"/></td>
                                    <td> <p:inputText id="address" value="#{enquiry.email}"/></td>
                                </tr>
                                <tr>
                                    <td><h:outputLabel value="Date: "/></td>
                                    <td><p:calendar value="#{enquiry.expectedDate}" binding="#{enquiry.dateInput}" validator="#{enquiry.validateDate}" required="true" label="Date"/></td>
                                </tr>
                                <tr>   
                                    <td><h:outputLabel value="Description: "/></td>

                                    <td><p:inputTextarea id="mobile" value="#{enquiry.description}"/>  </td>
                                </tr>
                                <tr>
                                    <td><p:commandButton value="Send Enquiry" actionListener="#{enquiryController.sendEnquiry(enquiry)}"/></td>
                                </tr>
                            </tbody>
                        </table>                 
                        <p:dialog header="Selected Dates" widgetVar="dialog"   
                                  showEffect="fade" hideEffect="fade">  

                            <h:panelGrid id="display" columns="2" cellpadding="5">  
                                <h:outputText value="Popup Date:" />  
                                <h:outputText value="#{enquiry.expectedDate}">  
                                    <f:convertDateTime pattern="MM/dd/yyyy"/>  
                                </h:outputText>  
                            </h:panelGrid>
                        </p:dialog>   
                    </p:panel>                                  
                </h:form>                
            </ui:define>

            <ui:define name="right">

            </ui:define>

        </ui:composition>

    </body>
</html>
